<template>
    <show-modal :title="title" :loading="loading" width="400px" @cancel="cancel" @submit="submit">
        <a-form-model ref="form" :model="form" :rules="rules" v-bind="layout">
            <a-form-model-item label="模板编码" prop="templateCode">
                <a-input v-model="form.templateCode" :disabled="form.templateId?true:false" placeholder="请输入模板编码" />
            </a-form-model-item>
            <a-form-model-item label="模板名称" prop="templateName">
                <a-input v-model="form.templateName" placeholder="请输入模板名称" />
            </a-form-model-item>
            <a-form-model-item label="通知方式" prop="notifyType">
                <a-select v-model="form.notifyType" showSearch placeholder="请选择通知方式">
                    <a-select-option :value="level.value" v-for="(level,index) in noticeTypes" :key="index">{{level.label}}</a-select-option>
                </a-select>
            </a-form-model-item>

            <!-- 短信 邮件 -->
            <a-form-model-item label="渠道选择" prop="notifyChannel" v-if="form.notifyType!='A'">
                <a-select v-model="form.notifyChannel" placeholder="请选择渠道">
                    <a-select-option :value="level.value" v-for="(level,index) in channelTypes" :key="index">{{level.label}}</a-select-option>
                </a-select>
            </a-form-model-item>

            <!-- 邮件 -->
            <a-form-model-item label="问候语" prop="lineLeader" v-if="form.notifyType=='B'">
                <a-input v-model="form.notifyStart" placeholder="请输入问候语" />
            </a-form-model-item>

            <!-- 通用 -->
            <a-form-model-item label="正文" prop="notifyText" help="请按规则输入内容，变量使用 ${} 引用">
                <a-textarea v-model="form.notifyText" placeholder="请输入正文" :auto-size="{ minRows: 5, maxRows: 10 }" />
            </a-form-model-item>

            <!-- 邮件 -->
            <a-form-model-item label="结尾" prop="lineLeader" v-if="form.notifyType=='B'">
                <a-input v-model="form.notifyEnd" placeholder="请输入结尾" />
            </a-form-model-item>
        </a-form-model>
    </show-modal>
</template>

<script>
import { rules } from './rules';
import {noticeTypes,channelTypes} from '../dictionary'
import {addInfo,updateInfo} from '@/api/notice/template'

export default {
    name: 'TemplateInfo',
    props:{
        info:{
            type:Object,
            default:()=>{}
        },
        factoryList:{
            type:Array,
            default:()=>[]
        }
    },
    data() {
        return {
            loading: false,
            title: '模板信息',
            rules,
            noticeTypes,
            channelTypes,
            form: {
                templateName: '',
                templateCode:'',
                notifyType:'C',
                notifyText:'',
                notifyChannel:'C',
                notifyStart:'',
                notifyEnd:''
            },
            layout: {
                labelCol: { span: 5 },
                wrapperCol: { span: 19 }
            },
        };
    },
    created() {
        this.form = {...this.form,...this.info}
    },
    methods: {
        //提交信息
        submit(){
            this.$refs.form.validate(async valid => {
                if (valid) {
                    try {
                        this.loading = true;
                        let form = this.form;
                        let res = null
                        if (form.templateId) {
                            //编辑
                            res = await updateInfo(form);
                        } else {
                            //新增addInfo
                            res = await addInfo(form);
                        }
                        let {code} = res;
                        if(code==200){
                            this.$message.success('操作成功!');
                            this.$emit('submit');
                        }
                    } finally {
                        this.loading = false;
                    }
                }
            });
        },
        //取消
        cancel() {
            this.$emit('cancel');
        }
    }
};
</script>

<style lang="scss" scoped></style>
